<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
</head>

<body>
  <!-- 1 准备容器 -->
  <div id="app">
    <h1>{{msg}}</h1>
    <h2>{{count}}</h2>

  </div>

  <!-- 2.开发版本的核心包 -->
  <script src="../vue/vue.js"></script>
  <script>
    /**
     * 使用vue的四个操作步骤：
     *  1.准备容器（vue管理的范围）
     *  2.引包(开发/生成 包)
     *  3.创建vue实例
     *  4.添加配置项===》完成渲染
     * 
     * 
     */


    // 3   创建vue对象
    const app = new Vue(
      {
        // el :配置的是选择器。表明该 vue实例控制的是哪个容器
        el: '#app',
        // 通过data 传递要渲染的数据：
        data: {
          msg: 'vue开始了',
          count: 666
        }
      }
    )

  </script>
</body>

</html>